<!DOCTYPE html>
<html>
    <head>
        <title>分页栏组件</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
       <link type="text/css" rel="stylesheet" href="../style/avalon.doc.css">
        <script src="../../avalon.js">

        </script>
        <script src="../highlight/shCore.js">

        </script>
        <script>
            avalon.library("aoyou", {
                $ready: function () {
                    avalon.log("控件已经构建完毕")
                }
            })
            require(["./component/pager/avalon.pager"], function () {
                avalon.define({
                    $id: "test",
                    $pager: {
                        totalItems: 150,
                        perPages: 5,
                        $$template: function (tmpl) {
                            return "<select  ms-duplex='perPages' style='float:left;height:24px;' ><option ms-repeat='options'>{{el.text}}</option></select>" + tmpl
                        },
                        options: [5, 10, 15]
                    }
                })
                avalon.scan()
            })

        </script>
    </head>
    <body ms-controller="test">
        <h1>改变每页显示的数量</h1>
        <aoyou:pager config="$pager"></aoyou:pager>
        <pre class="brush:html;gutter:false;toolbar:false">
&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;title&gt;分页栏组件&lt;/title&gt;
        &lt;meta charset="UTF-8"&gt;
        &lt;meta name="viewport" content="width=device-width"&gt;
        &lt;link type="text/css" rel="stylesheet" href="../style/avalon.doc.css"&gt;
        &lt;script src="../../avalon.js"&gt;&lt;/script&gt;
        &lt;script&gt;
            avalon.library("aoyou", {//IE9+可以不写
                $ready: function () {
                    avalon.log("控件已经构建完毕")
                }
            })
            require(["./component/pager/avalon.pager"], function () {
                avalon.define({
                    $id: "test",
                    $pager: {
                        currentPage: 8,
                        totalItems: 1436,
                        showJumper: true
                    }
                })
                avalon.scan()
            })
        &lt;/script&gt;
    &lt;/head&gt;
    &lt;body ms-controller="test"&gt;
        &lt;h1&gt;显示跳转台(点击确认或输入框里回车都能跳转页码)&lt;/h1&gt;
    &lt;aoyou:pager config="$pager"&gt;&lt;/aoyou:pager&gt;
&lt;/body&gt;
&lt;/html&gt;
        </pre>
    </body>
</html>
